<template>
	<view class="main">
		<view class="tit">
			<text>原借据号信息：</text>
		</view>
		<view class="table">
			<view class="th">
				<view class="thCont">
					<checkbox value="cb" :checked="allCk" @click="allClick(allCk)" />
				</view>
				<view class="thCont" v-for="item in th" :key='item.name'>
					{{item.name}}
				</view>
			</view>
			<block v-for="(item,index) in td">
				<view class="td">
					<view class="tdCont">
						<checkbox value="cb" :checked="item.checkState" @click="tdCheck(item.checkState,index)" />
					</view>
					<view class="tdCont" style="word-wrap:break-word;word-break: break-all">
						{{item.dubilNo}}
					</view>
					<view class="tdCont">
						{{item.custName}}
					</view>
					<view class="tdCont">
						{{item.prodtName}}
					</view>
					<view class="tdCont">
						{{item.loanStartDt}}
					</view>
					<view class="tdCont">
						{{item.loanMatrDt}}
					</view>
					<view class="tdCont">
						<mInput disabled maxlength="16" v-model="item.dubilAmt" />
					</view>
					<view class="tdCont">
						<mInput disabled maxlength="16" v-model="item.dubilBal" />
					</view>
					<view class="tdCont">
						{{item.loanLvlFiveCasct}}
					</view>
					<view class="tdCont">
						<mInput :disabled='loanType==2' @blur='blurCk($event,item)' maxlength="12"
							v-model="item.formerAmount" />
					</view>
				</view>
			</block>
		</view>
		<block v-if="loanType==3">
			<view class="active_tit">
				<view class="tit">
					输入借据编号或合同编号引入其他借据：
				</view>
			</view>
			<ActiveForm ref=''>
				<view class="active_label">
					借据编号：
				</view>
				<view class="active_input">
					<input type="text" v-model="dubilNo" />
				</view>
				<view style="margin-left: 3rem;width: 10rem;">

				</view>
			</ActiveForm>
			<ActiveForm ref=''>
				<view class="active_label">
					合同编号：
				</view>
				<view class="active_input">
					<input type="text" v-model="ctrctNo" />
				</view>
				<button style="margin-left: 3rem;" type="pg" @click="getIOU()">引入</button>
			</ActiveForm>

		</block>



	</view>
</template>

<script>
	export default {
		data() {
			return {
				loanType: '2',
				allCk: false,
				th: [{
					name: '借据编号'
				}, {
					name: '客户名称'
				}, {
					name: '业务产品名称'
				}, {
					name: '起始日'
				}, {
					name: '到期日'
				}, {
					name: '贷款金额（元）'
				}, {
					name: '贷款余额（元）'
				}, {
					name: '五级分类'
				}, {
					name: '还旧金额（元）'
				}],
				td: [{
					formerAmount: 0
				}],
				td2: [],
				td3: [],
				dubilNo: '',
				ctrctNo: ''
			}
		},
		watch: {
			td: {
				handler: function(res) {
					//console.warn('td', res)
					getApp().globalData.stdOffsurPromissoryNote = res

				},
				deep: true
			}
		},

		mounted() {
			//获取返显数据
			setTimeout(() => {
				//数据反显
				//console.log(getApp().globalData.stdOffsurPromissoryNote)
				if (getApp().globalData.stdOffsurPromissoryNote === undefined) {
					getApp().globalData.stdOffsurPromissoryNote = []
				}
				this.td2 = [...getApp().globalData.StdOffsurPromissory2, ...getApp().globalData.stdOffsurPromissoryNote]
				this.td3 = getApp().globalData.stdOffsurPromissoryNote
				this.loanType = getApp().globalData.stdOffsurBaiscInfo.loanType
				//console.log(this.td2)

				// 去重
				let result = [];
				let obj = {};
				for (let i = 0; i < this.td2.length; i++) {

					if (!obj[this.td2[i].dubilNo]) {
						result.push(this.td2[i]);
						obj[this.td2[i].dubilNo] = true;
					}
				}
				//console.log(result)
				this.td = result
				for (let k = 0; k < this.td.length; k++) { //选择

					for (let j = 0; j < this.td3.length; j++) {
						if (this.td[k].dubilNo == this.td3[j].dubilNo) {
							this.td[k].formerAmount = this.td3[j].formerAmount
							if (this.td3[j].checkState === true || this.td3[j].checkState === '1') {
								this.td[k].checkState = true
							}

						}
					}
				}

				if (this.loanType == 2) { //还旧金额赋值
					for (let i = 0; i < this.td.length; i++) {
						this.td[i].formerAmount = this.td[i].dubilBal
					}
				}
			}, getApp().globalData.timeout)

		},
		methods: {
			blurCk(e, item) {
				//console.log(e, item.dubilBal)
				if (Number(e) > item.dubilBal) {
					uni.showToast({
						title: '借据:' + item.dubilNo + '的还旧金额不能大于贷款余额',
						icon: "none",
						duration: 2000
					})
					item.formerAmount = 0
					return false

				}
			},
			allClick(e) {
				if (!e) {
					this.allCk = true
					for (let i = 0; i < this.td.length; i++) {
						this.td[i].checkState = true
					}
				} else {
					this.allCk = false
					for (let i = 0; i < this.td.length; i++) {
						this.td[i].checkState = false
					}
				}
			},
			tdCheck(e, index) {

				if (!e) {
					this.td[index].checkState = true
					let num = 0
					for (let i = 0; i < this.td.length; i++) {
						if (!this.td[i].checkState) {
							this.allCk = false
							break
						} else {
							num++
						}
					}
					if (num == this.td.length) {
						this.allCk = true
					} else {
						this.allCk = false
					}
				} else {
					this.td[index].checkState = false
					this.allCk = false
				}

			},
			getIOU() {
				if (this.dubilNo == '' && this.ctrctNo == '') {
					uni.showToast({
						title: '请输入借据编号或者合同编号',
						icon: "none",
						duration: 2000
					})
					return false
				}
				let arr = [...this.td]
				//console.log(arr)
				this.sendRequest({
					url: 'offsur/queryDuebillInfo',
					method: 'post',
					hideLoading: true,
					data: {
						loanType: this.loanType,
						ctrctNo: this.ctrctNo,
						dubilNo: this.dubilNo
					},
					complete: (res) => {
						if (res.code == '200') {
							if (res.data.length === 0) {
								uni.showToast({
									title: '未查到借据信息！',
									icon: "none",
									duration: 2000
								})
							} else {
								//let newArr = JSON.parse(JSON.stringify(res.data)) 
								if (this.td.length == 0) {
									//arr.push(res.data[i])
									this.td = [...res.data]
								} else {
									let noarr = []
									for (let i = 0; i < res.data.length; i++) {

										for (let j = 0; j < this.td.length; j++) {
											if (res.data[i].dubilNo === this.td[j].dubilNo) {
												uni.showToast({
													title: res.data[i].dubilNo + '已存在',
													icon: "none",
													duration: 2000
												})
												noarr.push(res.data[i].dubilNo)
											} else {
												//arr.push(res.data[i])
											}
										}


									}

									let td = [...arr, ...res.data]
									let cArr = [...res.data]
									//console.log(noarr)
									for (let k = 0; k < td.length; k++) {
										for (let m = 0; m < noarr.length; m++) {
											if (td[k].dubilNo == noarr[m]) {
												cArr.remove(td[k])
											}
										}
									}
									this.td = [...arr, ...cArr]
								}

								//console.log(newArr)

							}


						} else {
							uni.showModal({
								title: "提示",
								content: "查询失败,请重试"
							})
						}
					}
				})
			},

		}
	}
</script>
<style scoped>

</style>
<style lang="scss">
	.qcode {
		width: 60rem;
		height: 60rem;

		uni-image {
			width: 100%;
			height: 100%;
		}

		image {
			width: 100%;
			height: 100%;
		}
	}

	.zx {
		width: 200rem;
		height: 100rem;
	}

	.main {
		padding: 5rem;

		.tit {
			width: 100%;
			font-size: 3.5rem;
			font-weight: bold;
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-bottom: 1rem;

			.btn {
				font-size: 2.8rem;
				width: 18rem;
				margin: 0;
				padding: 0;
			}
		}

		.table {
			width: 100%;
			font-size: 3rem;

			.th {
				background: #EAF0FF;
				border: 1px solid #dddddd;
				display: flex;
				justify-content: space-around;
				text-align: center;

				.thCont {
					width: 20rem;
					padding: 1rem 2rem;
					//border-right: 1px solid #333333;
				}
			}

			.td {
				width: 100%;
				border: 1px solid #dddddd;
				display: flex;
				justify-content: space-around;
				text-align: center;

				.tdCont {
					width: 25rem;
					padding: 1rem 2rem;
					display: flex;
					align-items: center;
					justify-content: center;
					//border-right: 1px solid #333333;

					.btn {
						font-size: 2.8rem;
						width: 18rem;
						padding: 0;
					}
				}
			}
		}
	}

	.submit {
		width: 40rem;
		margin-top: 5rem;
		padding: 0;
	}

	.uni-border-left {
		border: none !important;
	}
</style>
